<template>
  <div>
    <van-nav-bar title="文章详情" left-text="返回"  left-arrow @click-left="onClickLeft"
                 @click-right="onClickRight" />
    <div id="header" style="width: 100%;height:auto ; border: 1px solid silver;border-radius: 20px;">
      <div id="title">
        <h3>{{this.newsInfo.title}}</h3>
        <div>
          <span>来源:{{this.newsInfo.source}}</span><br />
          <span>发布时间:{{this.newsInfo.publishTime}}</span>
        </div>
      </div>
    </div>
    <div id="body" style=" padding: 20px;">
      <span style="line-height: 30px;">
        {{this.newsInfo.newsContext}}
      </span>
    </div>
  </div>
</template>

<script>

import axios from "axios";

export default {
  name: "newsDetail.vue",
  data() {
    return {
      newsId: '',
      newsInfo: {}
    }
  },
  //生命周期 - 创建完成（访问当前this实例）
  created() {

  },
  methods: {
    findNewsById() {
      axios.post('http://localhost:7000/xwen/findNewsById/' + this.newsId).then(res => {
        this.newsInfo = res.data.data;

      });
    },
    onClickLeft() {
      this.$router.go(-1)
    },
  },

  //生命周期 - 挂载完成（访问DOM元素）
  mounted() {
    this.newsId = this.$route.params.id;
    this.findNewsById();

  }

}
</script>

<style scoped>

</style>
